<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>04员工表格练习</title>
</head>
<body>
<input type="text" placeholder="请输入员工姓名" id="name">
<input type="text" placeholder="请输入员工工资" id="salary">
<input type="text" placeholder="请输入员工岗位" id="job">
<br>
<button onclick="insert()">添加</button>
<br>
<table border="1px" >
    <caption style="text-align: center">员工表</caption>
    <tr>
    <th>姓名</th>
    <th>工资</th>
    <th>岗位</th>
    </tr>

</table>
<script>
function insert(){
    //获取输入框
    let uName = document.getElementById('name').value;
    let uSalary = document.getElementById('salary').value;
    let uJob = document.getElementById('job').value;
    console.log(uName);
//创建tr
    let tr = document.createElement('tr');
//创建td
    let nameTd = document.createElement('td');
    let salaryTd = document.createElement('td');
    let jobTd = document.createElement('td');
    //将获取的数据装入
    nameTd.innerHTML = uName;
    salaryTd.innerHTML = uSalary;
    jobTd.innerHTML = uJob;
    //td撞到tr中
    tr.append(nameTd,salaryTd,jobTd);
    //将tr放入表格中
    document.querySelector('table').append(tr);



}
</script>

</body>
</html>